<template>
  <view class="list">
    <navbar/>
    <u-swipe-action>
      <tree-list :list="list" :fold-all="true">
        <template #default="{item}">
          <u-swipe-action-item :options="deleteOption" @click="handleDelete(item)">
            <u-cell :border="false" @click="clickItem(item)">
              <template #title>
                {{ item.name }}
              </template>
            </u-cell>
          </u-swipe-action-item>
        </template>
      </tree-list>
    </u-swipe-action>
    <u-button class="add-button" type="primary" shape="circle" icon="plus" @click="handleCreate"/>
  </view>
</template>

<script>
import { deleteDepartment, fetchDepartmentList } from '@/api/department/department'
import TreeList from '@/components/TreeList/treeList'

export default {
  name: 'DepartmentList',
  components: { TreeList },
  data() {
    return {
      list: [],
      listQuery: {
        page: 1,
        limit: this.$store.dictStore.defaultPageSizes
      }
    }
  },
  // 下拉刷新
  onPullDownRefresh() {
    this.listQuery.page = 1
    this.list = []
    this.getList()
  },
  onLoad() {
    this.getList()
  },
  methods: {
    // 获取列表
    getList() {
      fetchDepartmentList().then(response => {
        if (response.data.success) {
          this.list = response.data.data
        }
      })
    },
    // 列表数据点击事件
    clickItem(item) {
      uni.navigateTo({
        url: `/pages/department/departmentForm?id=${item.id}`
      })
    },
    // 添加
    handleCreate() {
      uni.navigateTo({
        url: '/pages/department/departmentForm'
      })
    },
    handleDelete(item) {
      this.$uni.showModal('提示', '您确定删除该数据吗？').then(res => {
        if (res.confirm) {
          deleteDepartment(item.id).then(response => {
            if (response.data.success) {
              this.list.splice(this.list.indexOf(item), 1)
              this.$uni.showToast(response.data.msg)
            }
          })
        }
      })
    }
  }

}
</script>
